<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>后台</title>
	 <link rel="stylesheet" type="text/css" href="/css/css.css">
	 <link rel="stylesheet" type="text/css" href="/font-awesome-4.7.0/css/font-awesome.min.css">
	 <link  rel="stylesheet" type="text/css" href="/css/lyz.calendar.css" />
     <script src='/js/vue/vue.js'></script>
     <script src='/js/jquery.js'></script>
     <script src='/js/layer.js'></script>
</head>

<body>
	{include file='index/public/header'}
<div class="left">
{include file='index/public/left'}
</div>
<div id="dd">
	<input type='search' name='ddh'style='width:150px;height:25px;border:1px solid #ccc;'  v-model='search'/><input type='button' value='搜索订单号 ' style='margin-left:5px;width:70px;height:25px;background:#ff0000;border:0px;border-radius:2px;color:white;font-size:13px;' @click='search_add()'/>
	<ul class='dd_deta' style='float:right;'><li @click='status=1'>已发货</li><li>|</li><li @click='status=0'>待发货</li></ul>
<table width="84.8%" border="0" cellspacing="0" cellpadding="0" class="list" >
		<tr style='background:#f2f6fc;height:30px;font-size:13px;color:#666;'>
			<th class="bgtt" width="3%" >订单号</th>
           <th class="bgtt" width='15%'>商品图片</th>
           <th class="bgtt"  width='15%' style='text-align:left;text-indent:45px;'>商品规格</th>
           <th class="bgtt"  style='' width='15%'>价格x数量</th>
		   <th class="bgtt"  style='' width='15%'>买家ID</th>
		   <th class="bgtt"  style='text-align:left;'>操作</th>
		</tr>

 <tr style='font-size:13px;text-align:center;height:40px;color:#666;'  v-for='(o,k) in list'  v-if="o.status==status" >
     <td  style='color:#666;' >{{o.ddh}}</td>
     <td><img :src='o.img' width='80px' height='56px'/></td>
     <td  style='color:#666;text-align:left;' class='stand'>{{o.stand}}</td>
     <td  style='color:#666;' >{{o.mony}}x{{o.max}}</td>
	  <td  style='color:#666;' >{{o.user}}</td>
     <td style='margin-left:100px;text-align:left;' v-if='o.status==0'><a href='javascript:;' class='admin_edit'  @click='sp_status(k,o.ddh)' >点击发货</a></td>
</tr>



		</table>

</div>
</body>
</html>
<script>
   new Vue({
     el:"#dd",
	 data:{
		 status:0,
		 search:'',
	     list:[],
	 },
        methods:{
			  sp_status(sp_id,ddh){

			       layer.confirm('确定要将订单号为‘'+ddh+'’进行发货', {
                            btn: ['确定发货','暂时不发'] //按钮
                        }, function(){
							layer.msg('正在发货...', {time:20000, icon:16});
                              $.ajax({
							      url:'/admin.php/order/sp_status',
								  data:{spid:sp_id,ddh:ddh},
								  dataType:'json',
								  type:'post',
								  success:function(res){
								     if(res.status=='ok'){
									     layer.msg('已发货！', {time: 2000, icon:6});
									 }else{
									     layer.msg('系统繁忙！请稍后再进行发货！', {time: 2000, icon:7});
									 }
								  }
							  });
                        }, function(){
                             layer.closeAll();
						}     
                     );

			  },dd_list(search=''){
                  if(search){
				        var list={'search':search};
				  }else{
				      var list={};
				  }
				  let t=this;
				var index = layer.load(1, {
                          shade: [0.1,'#fff'] //0.1透明度的白色背景
                });

			      $.ajax({
				     url:'/admin.php/order/order_list',
					 data:list,
					 dataType:'json',
					 type:'post',
					 success:function(res){
						   layer.close(index);
					       t.list=res.sp_list;
					 }
				  });
			  },search_add(){
			      let t=this;
				  t.dd_list(t.search);
			  }
        },created(){
		   this.dd_list();
		}
   });
</script>
<style>
  tr{
    border-bottom:1px solid #ccc;
    }
    .right_main  table tr:hover{
       cursor:pointer;
       background:#efefef;
    }
    .inputtext{
       width:30px;
       height:20px;
    }
.save{
  float:right;
}
   .num{
       width:25px;
       height:20px;
       text-align:center;
       line-height:25px;
       margin-left:25px;
       margin-top:3px;
   }

    .admin_edit,.admin_del{border-radius:3px;}
    .admin_edit{
        border:1px solid green;
	color:green;
    }
    .admin_del{
       border:1px solid orange;
	color:orange;
    }
     #fabu{
      background: #09C878;
    padding: 0 10px 0 10px;
    color: #fff;
    float: right;
    margin: 8px 0px 10px 0;
    height: 26px;
    min-width: 26px;
    _width: 10px;
    line-height: 25px;
    border: 1px solid #00c874;
    border-radius: 18px;
    font-size: 12px
    }
    .stand span{
        float:left;
        height:26px;
        text-align:center;
        line-height:26px;
        border:1px solid #efefef;
        border-radius:3px;
        margin-left:5px;
    }
	.dd_deta li{float:left;margin-right:10px;color:#666;cursor:pointer;}
</style>
